<template>
  <div>
    <span class="f_16 f_bold">账户设置</span>
    <div class="inlineBlock pullRight">

      <div class="inlineBlock relative marginR20" style="top:-3px">{{shengR}} / {{zongR}}人</div>
      <Button type="primary" class="marginB10 " @click="otthw" v-show="(zongR-shengR)>=1">
        <Icon type="md-add" />
        新 增
      </Button>
    </div>
    <div class="clearBoth"></div>

    
    <Table :columns="columns1" :data="data1" stripe border :loading="loading"></Table>

    <OtherUser ref="OtherUser" />
  </div>
</template>

<script>
import OtherUser from "./_service/otherUser";
export default {
  name: 'accountZh',
  components:{OtherUser},
  data () {

    let data={
      companyAll: "",
      shengR:0,//子账号剩余人数
      zongR:0,//子账号总共能开几个人
      columns1: [
        {
          type: 'index',
          title:'序号',
          align: "center",
          width:70,
        },
        {
          title: '账户',
          key: 'mobile',
        },
        {
          title: '昵称',
          key: 'name',
        },
        {
          title: '角色',
          render: (h, params) => {
            let {
              row:{
                is_admin,
                role_name
              }
            }=params;
            let btnList=[
              h(
                "span",
                {
                  class: " ",
                },
                `${!!is_admin?'管理员':role_name}`
              )
            ];
            return h("div", btnList);
          }
        },
        {
          title: '操作',
          width:200,
          render: (h, params) => {

            let {
              row:{
                is_admin,
                role_name
              }
            }=params;

            let btnList=[
              h(
                $app.isMinScreen() ? "span" : "Button",
                {
                  class: 'marginR10'+($app.isMinScreen() ? " cBlue textLink f_bold " : ""),
                  props: {
                    icon: "md-open",
                    size: "small",
                    type: "primary"
                  },
                  on: {
                    click: () => {

                      console.log('编辑权限 = ',params.row)
                      this.doIt(params.row);
                    }
                  }
                },
                `编辑`
              ),
              h(
                $app.isMinScreen() ? "span" : "Button",
                {
                  class: ($app.isMinScreen() ? " c999 textLink f_bold " : ""),
                  props: {
                    icon: "ios-trash",
                    size: "small",
                    type: "default"
                  },
                  on: {
                    click: () => {
                      this.delZi(params.row);
                    }
                  }
                },
                `删除`
              ),
            ];
            return h("div",(!is_admin)? btnList : '');
          }
        }
      ],
      data1: [] // 数据
    };
    let tool={
      loading:true,//loading加载框
    };
    return Object.assign(data, tool);
  },
  created(){
    this.getList();//初始化数据
    $ajax.pInfo(resData => {
      this.companyAll = resData;
      this.zongR=resData.account_count;
    });
  },
  mounted () {
  },
  methods: {
    getList(callBack){
      this.loading=true;//显示loading框
      $ajax.mUserList(resData=>{
        this.loading=false;
        this.data1=resData.list;
        this.shengR=resData.list.length;

        callBack instanceof Function && callBack();
      });
    },
    //删除子账号
    delZi(obj){
      $app.confirm('是否删除该账号？','账号：'+obj.mobile,{
        yesFun:()=>{
          $ajax.mDelUser(obj.id,resData=>{
            this.getList();//初始化列表
          });
        },
      });
    },
    otthw(){
      this.$refs["OtherUser"].showBox = true; //显示弹框
    },
    doIt(obj){
      this.$refs["OtherUser"].showBox = true; //显示弹框
      this.$refs["OtherUser"].editObj=obj;
    }
  }
}
</script>

